<template>
  <div class="my-card">
    <div v-color="color">
        <!-- 具名插槽 -->
        <slot name="header">我是头部</slot>
    </div>
    <hr>
    <div class="body">
        <!-- 默认插槽 -->
       <slot :xx="msg" :row="obj"><h3>我是身体</h3></slot>
    </div>
  </div>
</template>

<script>
export default {
  
    data() {
        return {
            color: 'red',
            msg: '你好',
            count: 99,
            obj: {
                id: '11',
                name: 'jack'
            }
        }
    },
}
</script>

<style>
.my-card {
    margin-top: 30px;
    width: 420px;
    min-height: 300px;
    border: 1px solid #ddd;
    box-shadow: 0 0 10px 1px #000;
}
</style>
